.btn {
    width: 100%;
    place-items: center;
    background: #fff;
    padding: 7px;
    border-radius: 10px;
    box-shadow: 6px 6px 10px -1px rgba(0,0,0,0.15),
    -6px -6px 10px -1px rgba(255,255,255,0.7);
    border: 1px solid rgba(0,0,0,0);
    transition: transform 0.5s;
}

.btn:hover {
    box-shadow: inset 4px 4px 6px -1px rgba(0,0,0,0.2),
    inset -4px -4px 6px -1px rgba(255,255,255,0.7),
    -0.5px -0.5px 0 rgba(255,255,255,1),
    0.5px 0.5px 0 rgba(0,0,0,0.15),
    0 12px 10px -10px rgba(0,0,0,0.05);
    border: 1px solid rgba(0,0,0,0.1);
    transform: translateY(0.5em);
}

.btn svg {
    transition: transform 0.5s;
}

.btn:hover svg {
    transform: scale(0.9);
    fill: #333333;
}

